<template>
  <div>
    <h1>app.vue</h1>
    <p>msg -- {{ msg }}</p>
    <p>obj -- {{ obj }}</p>

    <!-- 
        :msg="msg" 这句话的意思是把父组件里的msg，传递给子组件要的msg

        :msg 是子组件要的部分   右边的部分是父组件传的部分
      -->
    <!-- <son :msg="msg" :oo="title" :obj="obj" @changeMsg="doSome"/> -->

    <!-- 
      如果是原生标签：$event代表事件对象
      如果是组件：$event代表组件传递过来的数据
     -->
    <son :msg="msg" :oo="title" :obj="obj" @changeMsg="doSome($event)"/>

  </div>
</template>

<script>

// 导入组件
import son from './components/son'

export default {

  // 注册子组件
  components: {

    son 
  },

  data() {
    return {
      msg: '马杀鸡',
      title: '深圳颜值担当',
      obj: {
        name: 'jack',
        age: 16
      }
    };
  },

  methods: {

    doSome (val) {

      console.log('子的数据过来了', val)
      this.msg = val
    }
  }
}
</script>

<style>

</style>